<template>
  <div class="social-signup-container">
    <div class="sign-btn" @click="wechatHandleClick('wechat')">
      <span class="wx-svg-container"><icon-svg icon-class="wechat" class="icon"></icon-svg></span> 微信
    </div>
    <div class="sign-btn" @click="tencentHandleClick('tencent')">
      <span class="qq-svg-container"><icon-svg icon-class="qq" class="icon"></icon-svg></span> QQ
    </div>
  </div>
</template>

<script>
  import openWindow from "@/utils/openWindow";
  import WeChatConfig from "../../../build/WeChatConfig.json";
  export default {
    name: "social-signin",
    props: {
      visible: {
        type: Boolean,
        default: true
      }
    },
    methods: {
      wechatHandleClick(thirdpart) {
        this.$emit("update:visible", false);
        // this.$store.commit("SET_AUTH_TYPE", thirdpart);
        // const appid = 'xxxxx'

        const appid = WeChatConfig.AppID; //"wx27c6eb21f106c091";
        const agentid = WeChatConfig.AgentID; // "1000004";
        // const redirect_uri = encodeURIComponent(`${WeChatConfig.RedirectUrl}/redirect?redirect=` + window.location.origin + "/authredirect" );
        // const redirect_uri = encodeURIComponent(`http://${WeChatConfig.RedirectUrl}` + "/#/authredirect" );
        const redirect_uri = encodeURIComponent( window.location.origin + "/#/authredirect" );
        const url =
          "https://open.work.weixin.qq.com/wwopen/sso/qrConnect?appid=" +
          appid +
          "&agentid=" +
          agentid +
          "&redirect_uri=" +
          redirect_uri;

        console.log(url);
        openWindow(url, thirdpart, 540, 540);
        // visible = false;
      },
      tencentHandleClick(thirdpart) {
        this.$store.commit("SET_AUTH_TYPE", thirdpart);
        const client_id = "xxxxx";
        const redirect_uri = encodeURIComponent(
          "xxx/redirect?redirect=" + window.location.origin + "/authredirect"
        );
        const url =
          "https://graph.qq.com/oauth2.0/authorize?response_type=code&client_id=" +
          client_id +
          "&redirect_uri=" +
          redirect_uri;
        openWindow(url, thirdpart, 540, 540);
      }
    }
  };
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
	.social-signup-container {
	  margin: 20px 0;
	  .sign-btn {
	    display: inline-block;
	    cursor: pointer;
	  }
	  .icon {
	    color: #fff;
	    font-size: 30px;
	    margin-top: 6px;
	  }
	  .wx-svg-container,
	  .qq-svg-container {
	    display: inline-block;
	    width: 40px;
	    height: 40px;
	    line-height: 40px;
	    text-align: center;
	    padding-top: 1px;
	    border-radius: 4px;
	    margin-bottom: 20px;
	    margin-right: 5px;
	  }
	  .wx-svg-container {
	    background-color: #8dc349;
	  }
	  .qq-svg-container {
	    background-color: #6BA2D6;
	    margin-left: 50px;
	  }
	}
</style>
